<template>
  <div class="home">
    <!-- 主体地图显示 -->
    <el-container style="height: 30%">
      <el-main>
        <!-- 顶部工具栏 -->
        <!-- <top-tool-bar @alarmchind="alarmchind" /> -->
        <!-- 地图显示 -->
        <map-view></map-view>
      </el-main>
    </el-container>
    <!-- 底部信息列表 -->
    <el-footer :class="hideFooter ? 'height0' : ''">
      <vdr class="vdr" :draggable="false">
        <div ref="footerTitle" class="footer_title">
          路线规划列表
          <i class="iconfont icon-shanchu" @click="toHideFooter()"></i>
        </div>
        <factory-view></factory-view>
      </vdr>
    </el-footer>

    <!-- 弹出框 添加路线 -->
    <el-dialog
      :title="formLine.Title"
      :visible.sync="addLineDialogShow"
      width="50%"
    >
      <el-form
        ref="formLine"
        :model="formLine"
        label-width="120px"
        class="flex"
        :disabled="formLine.Title === '编辑路线'"
      >
        <el-form-item label="车辆：" v-if="formLine.Title === '编辑路线'">
          <el-input v-model="formLine.LICENSE_PLATE"></el-input>
        </el-form-item>
        <el-form-item label="车辆：" v-if="formLine.Title === '新增路线'">
          <el-select
            style="width: 177px"
            v-model="formLine.VID"
            :options="optionsCarNoPlan"
            placeholder="请选择"
            filterable
            clearable
          >
            <el-option
              v-for="item in optionsCarNoPlan"
              :key="item.VID"
              :label="item.LICENSE_PLATE"
              :value="item.VID"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="出发时间：">
          <!-- <el-input
            v-model="formLine.StartTime"
            placeholder="请输入出发时间"
          ></el-input> -->
          <el-time-picker
            editable
            value-format="HH:mm"
            format="HH:mm"
            v-model="formLine.StartTime"
            :picker-options="{
              selectableRange: '00:00:00 - 23:59:00',
            }"
            placeholder="请输入出发时间"
          >
          </el-time-picker>
        </el-form-item>
        <el-form-item label="出发点经度：">
          <el-input
            v-model="formLine.StartLONGITUDE"
            placeholder="请输入出发点经度"
          ></el-input>
        </el-form-item>
        <el-form-item label="出发点纬度：">
          <el-input
            v-model="formLine.StartLATITUDE"
            placeholder="请输入出发点纬度"
          ></el-input>
        </el-form-item>
        <!-- <el-form-item label-width="20px">
          <div class="l-header" @click="showMapPointDialog('1')">
            <slot name="left">
              <img
                style="height: 26px"
                src="@/assets/img/marker/mapicon.png"
                alt=""
              />
            </slot>
          </div>
        </el-form-item> -->
        <el-form-item label="结束点经度：">
          <el-input
            v-model="formLine.EndLONGITUDE"
            placeholder="请输入结束点经度"
          ></el-input>
        </el-form-item>
        <el-form-item label="结束点纬度：">
          <el-input
            v-model="formLine.EndLATITUDE"
            placeholder="请输入结束点纬度"
          ></el-input>
        </el-form-item>
        <!-- <el-form-item label-width="20px">
          <div class="l-header" @click="showMapPointDialog('2')">
            <slot name="left">
              <img
                style="height: 26px"
                src="@/assets/img/marker/mapicon.png"
                alt=""
              />
            </slot>
          </div>
        </el-form-item> -->
      </el-form>
      <el-button
        type="success"
        style="float: right; margin: 20px"
        @click="openDialogAddPoint"
        >新增途径点</el-button
      >
      <el-table :data="formLine.pointsData">
        <el-table-column
          prop="PointID"
          label="点位ID"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="PointName"
          label="点位名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="Stime"
          label="最早到达时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="Etime"
          label="最晚到达时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="Wtime"
          label="停留时间"
          align="center"
        ></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-button
              type="text"
              @click="openDialogEditPoint(scope.$index, scope.row)"
              >编辑</el-button
            >
            <el-button
              type="text"
              @click="handleDeletePoint(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addLineDialogShow = false">取 消</el-button>
        <el-button type="primary" @click="handleSubmitLine()">确 定</el-button>
      </span>
    </el-dialog>

    <!-- 弹出框 添加途径点 -->
    <el-dialog
      :title="addDialogTitle"
      :visible.sync="addPointDialogShow"
      width="50%"
    >
      <el-form
        ref="formPoint"
        :model="formPoint"
        label-width="140px"
        class="flex"
      >
        <el-form-item label="点位名称：" style="width: 80%">
          <el-select
            :disabled="addDialogTitle === '编辑点位信息'"
            v-model="formPoint.title"
            filterable
            @change="changeMapPoint"
            placeholder="请输入点位名称"
          >
            <el-option
              v-for="(item, index) in dataRubbishPointsNoPlan"
              :value="item.ID"
              :label="item.ID + '-' + item.NAME"
              :key="index"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label-width="20px"
          v-if="addDialogTitle === '新增点位信息'"
        >
          <div class="l-header" @click="showMapPointDialog('3')">
            <slot name="left">
              <img
                style="height: 26px"
                src="@/assets/img/marker/mapicon.png"
                alt=""
              />
            </slot>
          </div>
        </el-form-item>
        <!-- <el-form-item label="经度：">
          <el-input
            v-model="formPoint.data.LONGITUDE"
            placeholder="请输入经度"
          ></el-input>
        </el-form-item> -->
        <!-- <el-form-item label="纬度：">
          <el-input v-model="formPoint.data.LATITUDE" placeholder="请输入纬度"></el-input>
        </el-form-item> -->
        <el-form-item label="最早到达时间：">
          <!-- <el-input
            v-model="formPoint.data.Stime"
            placeholder="请选择开始时间"
          ></el-input> -->
          <el-time-picker
            editable
            value-format="HH:mm"
            format="HH:mm"
            v-model="formPoint.data.Stime"
            :picker-options="{
              selectableRange: '00:00:00 - 23:59:00',
            }"
            placeholder="请选择最早到达时间"
          >
          </el-time-picker>
        </el-form-item>
        <el-form-item label="最晚到达时间：">
          <!-- <el-input
            v-model="formPoint.data.Etime"
            placeholder="请选择结束时间"
          ></el-input> -->
          <el-time-picker
            editable
            value-format="HH:mm"
            format="HH:mm"
            v-model="formPoint.data.Etime"
            :picker-options="{
              selectableRange: '00:00:00 - 23:59:00',
            }"
            placeholder="请选择最晚到达时间"
          >
          </el-time-picker>
        </el-form-item>
        <el-form-item label="停留时间（秒）：">
          <el-input
            v-model="formPoint.data.Wtime"
            placeholder="工作所需停留时间"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addPointDialogShow = false">取 消</el-button>
        <el-button type="primary" @click="handleSubmitAddPoint()"
          >确 定</el-button
        >
      </span>
    </el-dialog>

    <!-- 弹出框 从地图取点 -->
    <el-dialog title="获取地址信息" :visible.sync="formPoint.show" width="50%">
      <el-form
        ref="formPoint"
        :model="formPoint"
        label-width="140px"
        class="flex"
      >
        <el-form-item label="点位名称：" style="width: 80%">
          <el-select
            v-model="formPoint.title"
            filterable
            placeholder="请输入点位名称"
            @change="changeMapPoint"
          >
            <el-option
              v-for="(item, index) in dataRubbishPointsNoPlan"
              :value="item.ID"
              :label="item.ID + '-' + item.NAME"
              :key="index"
            ></el-option>
          </el-select>
          <!-- <el-input
            id="suggestId"
            v-model="formPoint.LOCATION"
            placeholder="请输入点位名称"
          ></el-input> -->
        </el-form-item>
        <!-- <el-form-item label="经度：">
          <el-input
            v-model="formPoint.data.LONGITUDE"
            placeholder="请输入经度"
          ></el-input>
        </el-form-item> -->
        <!-- <el-form-item label="纬度：">
          <el-input
            v-model="formPoint.data.LATITUDE"
            placeholder="请输入纬度"
          ></el-input>
        </el-form-item> -->
      </el-form>
      <div
        id="mapDialog"
        style="width: 90%; height: 400px; margin-left: 5%; margin-right: 5%"
      ></div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="formPoint.show = false">取 消</el-button>
        <el-button type="primary" @click="handleSubmitMapPoint()"
          >确 定</el-button
        >
      </span>
    </el-dialog>

    <!-- 弹出框 垃圾点位详情列表 -->
    <el-dialog
      title="途径垃圾点位详情"
      :visible.sync="PointListDialogShow"
      width="50%"
    >
      <el-table :data="PointListData">
        <el-table-column
          prop="PointName"
          label="点位名称"
          align="center"
        ></el-table-column>
        <el-table-column
          :formatter="formatterYJTime"
          label="预计到达时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="Wtime"
          label="预计作业时长（秒）"
          align="center"
        ></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-button
              type="text"
              @click="openDialogEditPoint(scope.$index, scope.row)"
              >编辑</el-button
            >
            <el-button
              type="text"
              @click="DeletePointOfWorkLine(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="PointListDialogShow = false">取 消</el-button>
        <!-- <el-button type="primary" @click="PointListDialogShow = false">确 定</el-button> -->
      </span>
    </el-dialog>
  </div>
</template>
<script>
import '@/assets/css/common.css'
import export2Excel from '@/utils/exportExcel/index.js'
import mapicon from '@/assets/img/marker/mapicon.png'
import eventBus from '@/eventBus.js'
import mapView from '@/views/Kitchen/PlannedRoute/PlannedMap.vue'
import FactoryView from '@/views/Kitchen/PlannedRoute/PlannedTable.vue'
// import imgMarkerRubbishPoint from '@/assets/img/marker/rubbishMarker1.png'
export default {
  components: {
    'map-view': mapView,
    'factory-view': FactoryView
  },
  data () {
    return {
      marker: null,
      mapDialog: null,
      mapZoom: 9,
      hideFooter: false, // 是否显示底部列表
      currentPage: 1, // 初始页
      pageSize: 10, //    每页的数据
      originalData: [],
      tableData: [],
      dataRubbishPointsNoPlan: [],
      dataRubbishPoints: [],
      isVisibleEdit: false,
      // form: {
      //   tag: '',
      //   LONGITUDE: '',
      //   LATITUDE: '',
      //   LOCATION: '',
      //   stime: '',
      //   etime: '',
      //   wtime: '',
      //   lineData: {}
      // },
      formLine: {
        Title: '新增路线',
        ID: '',
        VID: '',
        StartLATITUDE: '',
        StartLONGITUDE: '',
        StartTime: '05:00',
        EndLONGITUDE: '',
        EndLATITUDE: '',
        pointsData: []
      },
      formPoint: {
        // VID: '',
        // PointID: '',
        //   PointName: '',
        //   Stime: '',
        //   Etime: '',
        //   Wtime: '',
        //   ATime: '',
        //   Number: '',
        //   LONGITUDE: '',
        //   LATITUDE: '',
        //   LOCATION: '',
        title: '',
        data: {},
        show: false,
        tag: ''
      },
      MapV: {
        iconLayerDic: {},
        textLayerDic: {},
        dataSetDic: {}
      },
      addDialogTitle: '',
      // addLineDialogTitle: '',
      addLineDialogShow: false,
      addPointDialogShow: false,
      PointListDialogShow: false,
      PointListData: [],
      optionsCarPlaned: [],
      optionsCarNoPlan: [],
      isZoomChange: 'S'
    }
  },
  created () {
    // 显示底部列表
    eventBus.$on('toShowFooter', () => {
      this.hideFooter = false
    })
    // 隐藏底部列表
    eventBus.$on('toHideFooter', () => {
      this.hideFooter = true
    })
    // 自动刷新 + 显示标记点
    eventBus.$on('getPointsFromMap', val => {
      this.openDialogAddLine(val)
    })
    eventBus.$on('openDialogAddLine', () => {
      this.openDialogAddLine(null)
    })
    eventBus.$on('openDialogAddPoint', val => {
      // this.formLine.pointsData = val
      this.formLine = val
      this.openDialogAddPoint()
    })
    eventBus.$on('openDialogPointList', val => {
      // this.formLine.pointsData = val
      this.PointListData = val
      console.log(val)
      this.openDialogPointList()
    })
    eventBus.$on('excelLoad', val => {
      // this.formLine.pointsData = val
      // this.openDialogPointList();
      this.addWorkLine(val)
    })
    eventBus.$on('dataRubbishPoints', val => {
      this.dataRubbishPoints = val
      this.dataRubbishPointsNoPlan = val[0]
    })
  },
  mounted () {
    this.getlistCar()
  },
  methods: {
    // 已有途径点位列表窗口
    openDialogPointList () {
      this.PointListDialogShow = true
    },
    formatterYJTime (row) {
      return row.Stime + ' - ' + row.Etime
    },

    // 途径点位窗口-新增
    openDialogAddPoint () {
      this.addDialogTitle = '新增点位信息'
      // 清空编辑框
      this.formPoint.title = ''
      this.formPoint.data = {}
      // 展示窗口
      this.addPointDialogShow = true
    },
    // 途径点位窗口-编辑
    openDialogEditPoint (index, row) {
      this.addDialogTitle = '编辑点位信息'
      this.formPoint.data = row
      this.formPoint.title = row.PointID + '-' + row.PointName
      // 展示窗口
      this.addPointDialogShow = true
    },
    // 新增路线Dialog 打开
    openDialogAddLine (val) {
      if (!val) {
        this.formLine = {}
        this.formLine.pointsData = []
        this.formLine.Title = '新增路线'
      } else {
        if (val.plan.ID) {
          this.formLine = val.plan
          this.formLine.pointsData = val.arrayPointIn
          this.formLine.Title = '编辑路线'
        } else {
          this.formLine = val.plan
          this.formLine.pointsData = val.arrayPointIn
          this.formLine.Title = '新增路线'
        }
      }
      this.addLineDialogShow = true
    },
    // 新增路线Dialog 增加途径点位Dialog，确定后
    handleSubmitAddPoint () {
      if (this.PointListDialogShow) {
        this.updatePointOfWorkLine()
      } else
      if (this.addLineDialogShow) {
        for (var i = this.formLine.pointsData.length - 1; i >= 0; i--) {
          if (this.formLine.pointsData[i].PointID === this.formPoint.data.PointID) {
            this.formLine.pointsData.splice(i, 1)
          }
        }
        this.formLine.pointsData.push(this.formPoint.data)
        this.addPointDialogShow = false
      } else {
        this.formPoint.data.VID = this.formLine.VID
        this.addPointOfWorkLine([this.formPoint.data])
      }
    },
    // 新增路线Dialog 途径点位列表，删除
    handleDeletePoint (index, row) {
      for (var i = this.formLine.pointsData.length - 1; i >= 0; i--) {
        if (this.formLine.pointsData[i].PointID === row.PointID) {
          this.formLine.pointsData.splice(i, 1)
        }
      }
    },
    // 新增路线Dialog，确定后
    handleSubmitLine () {
      if (this.formLine.ID) {
        this.updatePointListOfWorkLine()
      } else {
        var paraData = {
          VID: this.formLine.VID,
          StartTime: this.formLine.StartTime,
          StartLONGITUDE: this.formLine.StartLONGITUDE,
          StartLATITUDE: this.formLine.StartLATITUDE,
          EndLONGITUDE: this.formLine.EndLONGITUDE,
          EndLATITUDE: this.formLine.EndLATITUDE,
          PointList: this.formLine.pointsData
        }
        this.addWorkLine(paraData)
      }
    },
    async addWorkLine (paraData) {
      console.log(paraData.VID)
      this.$axios({
        url: 'Kitchen/AddWorkLineAndPointList',
        method: 'post',
        data: paraData
      }).then(res => {
        console.log('AddWorkLineAndPointList')
        console.log(res.data)
        if (res.data.IsSucess) {
          eventBus.$emit('UpdateTable')
          this.$message.success('操作成功')
          this.addLineDialogShow = false
        } else {
          this.$message.error(res.data.Message)
        }
      })
    },
    async updatePointOfWorkLine () {
      var url = '/Kitchen/UpdatePointInfoOfWorkLine?Stime=' + this.formPoint.data.Stime + '&Etime=' + this.formPoint.data.Etime +
        '&Wtime=' + this.formPoint.data.Wtime + '&PointID=' + this.formPoint.data.PointID + '&PlanID=' + this.formPoint.data.ID
      const { data } = await this.$Http.get(url)

      if (data.IsSucess) {
        eventBus.$emit('UpdateTable')
        this.$message.success('操作成功')
        this.addPointDialogShow = false
      } else {
        this.$message.error(res.data.Message)
      }
    },
    async DeletePointOfWorkLine (index, row) {
      var url = '/Kitchen/DeletePointOfWorkLine?PointID=' + row.PointID + '&PlanID=' + row.ID
      const { data } = await this.$Http.get(url)
      if (data.IsSucess) {
        eventBus.$emit('UpdateTable')
        this.$message.success('操作成功')
        this.addPointDialogShow = false
        this.PointListData.splice(index, 1)
      } else {
        this.$message.error(res.data.Message)
      }
    },
    async updatePointListOfWorkLine () {
      var paraData = {
        ID: this.formLine.ID,
        PointList: this.formLine.pointsData
      }
      this.$axios({
        url: 'Kitchen/UpdatePointListOfWorkLine',
        method: 'post',
        data: paraData
      }).then(res => {
        console.log('UpdatePointListOfWorkLine')
        console.log(res.data)
        if (res.data.IsSucess) {
          eventBus.$emit('UpdateTable')
          this.$message.success('操作成功')
          this.addLineDialogShow = false
        } else {
          this.$message.error(res.data.Message)
        }
      })
    },
    async addPointOfWorkLine (para) {
      this.$axios({
        url: 'Kitchen/AddPointlistForWorkLine',
        method: 'post',
        data: para
      }).then(res => {
        console.log('AddPointlistForWorkLine')
        console.log(res.data)
        if (res.data.IsSucess) {
          eventBus.$emit('UpdateTable')
          this.$message.success('操作成功')
          this.addPointDialogShow = false
        } else {
          this.$message.error(res.data.Message)
        }
      })
    },
    // 获取下拉框数组-车辆列表
    async getlistCar () {
      var url = '/Kitchen/GetVehicleListPlan'
      const { data } = await this.$Http.get(url)
      data.forEach(element => {
        if (element.ID) {
          this.optionsCarPlaned.push(element)
        } else {
          this.optionsCarNoPlan.push(element)
        }
      })
      eventBus.$emit('getCarPlaned', this.optionsCarPlaned)

      // const loading = this.$loading({
      //   lock: true,
      //   text: '数据加载中...',
      //   spinner: 'el-icon-loading',
      //   background: 'rgba(0, 0, 0, 0.5)'
      // })
      // let _this = this;
      // var url = '/Kitchen/GetVehicleListPlan'
      // this.$axios({
      //   url: url,
      //   method: 'get',
      // }).then(res => {
      //   loading.close()
      //   if (res.data) {
      //     _this.optionsCarPlaned = res.data
      //   }
      // })
    },
    showMapPointDialog (tag) {
      this.formPoint.show = true
      // this.formPoint.tag = tag
      if (!this.mapDialog) {
        const _this = this
        setTimeout(() => {
          _this.mapShow()
        }, 2000)// 延时3秒
      }
    },
    handleSubmitMapPoint () {
      this.formPoint.show = false
    },
    changeMapPoint () {
      var array = this.dataRubbishPointsNoPlan.filter(item => item.ID === this.formPoint.title)
      var itemPoint = array[0]
      this.formPoint.title = itemPoint.ID + '-' + itemPoint.NAME
      // this.formPoint.data = itemPoint;
      this.formPoint.data.PointName = itemPoint.NAME
      this.formPoint.data.PointID = itemPoint.ID
      this.formPoint.data.LONGITUDE = itemPoint.LONGITUDE_GPS
      this.formPoint.data.LATITUDE = itemPoint.LATITUDE_GPS
    },
    // 显示地图
    mapShow () {
      var point = new BMap.Point(117.691259, 39.010868)
      // 百度地图API功能
      this.mapDialog = new BMap.Map('mapDialog') // 创建Map实例
      this.mapDialog.centerAndZoom(point, this.mapZoom)
      // this.mapDialog.setCurrentCity('滨海新区') // 设置地图显示的城市 此项是必须设置的

      // 开启滚轮缩放
      this.mapDialog.enableScrollWheelZoom(true)
      // 缩放屏幕
      const _this = this
      this.mapDialog.addEventListener('zoomend', function (e) {
        // console.log("地图缩放至：" + this.getZoom() + "级");
        // var aa = e.target.getZoom();
        if (e.target.getZoom() > 12 && _this.isZoomChange === 'S') {
          _this.isZoomChange = 'B'
          for (var key in _this.MapV.textLayerDic) {
            _this.MapV.textLayerDic[key].show()
          }
          _this.drawRubbishPoints()
        }
        if (e.target.getZoom() < 13 && _this.isZoomChange === 'B') {
          _this.isZoomChange = 'S'
          for (var key1 in _this.MapV.textLayerDic) {
            _this.MapV.textLayerDic[key1].hide()
          }
          _this.drawRubbishPoints()
        }
      })
      this.drawRubbishPoints()
    },

    // 画途经垃圾点位
    drawRubbishPoints () {
      console.log('点位：', this.dataRubbishPoints)
      for (var key in this.MapV.dataSetDic) {
        this.MapV.dataSetDic[key].set([])
      }
      const _self = this
      var pointArrRubbishPoints = []
      this.dataRubbishPoints.forEach(element => {
        if (element[0].image == '1') {
          return
        }
        const img = new Image()
        // img.src = imgMarkerRubbishPoint
        img.src = require('@/assets/img/marker/PlanPoint' + element[0].image + this.isZoomChange + '.png')
        img.onload = function () {
          const key = element[0].image
          // 循环加载同一张图片的车辆数据
          const arrayImage = element.map(v => {
            v.geometry = {
              type: 'Point',
              coordinates: [v.LONGITUDE, v.LATITUDE]
            }
            v.icon = img
            v.text = v.NAME
            pointArrRubbishPoints.push(new BMap.Point(v.LONGITUDE, v.LATITUDE))
            return v
          })

          if (_self.MapV.dataSetDic.hasOwnProperty(key)) {
            _self.MapV.dataSetDic[key].set(arrayImage)
          } else {
            _self.mapDialog.setViewport(pointArrRubbishPoints)
            const optionsICON = {
              zIndex: 2,
              draw: 'icon',
              size: 30,
              width: 30, // 规定图像的宽度
              height: 30, // 规定图像的高度
              methods: { // 一些事件回调函数
                click: function (item, event) { // 点击事件，返回对应点击元素的对象值.
                  if (item) {
                    _self.formPoint.title = item.ID + '-' + item.NAME
                    _self.formPoint.data.PointName = item.NAME
                    _self.formPoint.data.PointID = item.ID
                    _self.formPoint.data.LATITUDE = item.LATITUDE_GPS
                    _self.formPoint.data.LONGITUDE = item.LONGITUDE_GPS
                  }
                }
              },
              offset: { // 偏移值
                x: 0,
                y: 25
              }
            }
            const optionsTEXT = {
              zIndex: 1,
              draw: 'text',
              avoid: true, // 开启文本标注避让
              textBaseline: 'middle',
              offset: { // 文本便宜值
                x: 0,
                y: 50
              }
            }
            var dataSet = new mapv.DataSet(arrayImage)
            _self.MapV.dataSetDic[key] = dataSet
            _self.MapV.iconLayerDic[key] = new mapv.baiduMapLayer(_self.mapDialog, dataSet, optionsICON)
            _self.MapV.textLayerDic[key] = new mapv.baiduMapLayer(_self.mapDialog, dataSet, optionsTEXT)
          }
        }
      })
    },
    // 分页导航
    handlePageChange (currentPage) {
      this.currentPage = currentPage
      // console.log(this.currentPage)
      // this.$set(this.query, 'pageIndex', val);
      // this.getlistdata();
    },
    handleSizeChange (size) {
      this.pageSize = size
      console.log(this.pageSize)
    },
    // 隐藏底部列表
    toHideFooter () {
      this.hideFooter = true
      eventBus.$emit('toHideFooter')
    }
  }
}
</script>
<style scoped lang="less">
.home {
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.vdr {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  // bottom: 0 !important;
  height: 100% !important;
  width: 100% !important;
}
.el-footer {
  width: 100%;
  min-height: 19.417vw !important;
  max-height: 40.417vw;
  z-index: 3;
  background: #fff;
  &.height0 {
    min-height: 0 !important;
    height: 0 !important;
  }
  // position: relative;
  // margin-bottom: 20px;
  .footer_title {
    line-height: 1.963vw;
    background-color: rgb(32, 105, 179);
    color: #fff;
    // cursor: s-resize;
    padding-left: 1.042vw;
    font-weight: 600;
    i {
      float: right;
      margin-right: 0.521vw;
      cursor: pointer;
    }
  }
}
</style>
